<template name="shareAction">
	<view class="mask" :class="[acShow?'':'acMask']" v-if="isShow" @tap="close">
		<view class="koulinBox" v-if="!acShow">
			<text class="title">口令已复制</text>
			<text class="koulin">{{koulin}}</text>
			<view class="buttonBox" @tap="openQQ">
				<text class="iconfont icon-qq"></text>
				<text >去QQ粘贴给好友</text>
			</view>
		</view>
		<view class="actionBox" v-if="acShow">
			<view class="list">
				<view class="item" @tap.stop="copy">
					<text class="iconfont icon-copy"></text>
					<text>复制口令</text>
				</view>
				<view class="item"  @tap.stop="share('QQ')" v-if="isIstQQ">
					<text class="iconfont icon-qq"></text>
					<text>QQ</text>
				</view>
				<view class="item"   @tap.stop="share('WXSceneSession')" v-if="isIstWx">
					<text class="iconfont icon-weixin"></text>
					<text>微信</text>
				</view>
				<view class="item"  @tap.stop="share('WXSenceTimeline')" v-if="isIstWx">
					<text class="iconfont icon-pengyouquan"></text>
					<text>朋友圈</text>
				</view>
				<view class="item"  @tap.stop="share('sinaweibo')" v-if="isIstWeibo">
					<text class="iconfont icon-sina"></text>
					<text>微博</text>
				</view>
			</view>
			<button @tap="close">取消</button>
		</view>
	</view>
</template>

<script>
	import {mapState,mapGetters,mapMutation,mapActions} from "vuex";
	export default{	
		name:'shareAction',		//组件名称
		// 传递参数
		props:{
			prop1:{
				type:String,
				default:''
			}
		},
		// 组件参数
		data(){
			return {
				isShow:false,
				acShow:true,
				koulin:'hellow',
				id:0,
				type:0,
				title:'',
				img:'',
				href:'',
				cntText:'',
				isIstWx: false,
				isIstQQ: false,
				isIstWeibo:false
			}
		},
		// 组件方法
		methods:{
			checkInstall() {
				// #ifdef APP-PLUS
				if (plus.runtime.isApplicationExist({
						pname: 'com.tencent.mm',
						action: 'weixin://'
					})) {
					this.isIstWx = true;
				}
				if (plus.runtime.isApplicationExist({
						pname: 'com.tencent.mobileqq',
						action: 'mqq://'
					})) {
					this.isIstQQ = true;
				}
				if (plus.runtime.isApplicationExist({
						pname: 'com.sina.weibo',
						action: 'sinaweibo://'
					})) {
					this.isIstWeibo = true;
				}
				// #endif
			},
			share(e){
				// if(e=='QQ' &&uni.getSystemInfoSync().platform=='android'){
				// 	this.acShow=false;
				// }else{
				// 	this.close();
				// 	this.$store.dispatch("shareCard",{
				// 		provider:e,
				// 		title:this.title,
				// 		img:this.img,
				// 		href:this.href,
				// 		text:this.cntText
				// 	})
				// }
				this.$store.dispatch("shareCard",{
					provider:e,
					title:this.title,
					img:this.img,
					href:this.href,
					text:this.cntText
				})
				
				
			},
			copy(){
				uni.setClipboardData({
				    data:this.koulin,
				    success: ()=>{
				       uni.showToast({
				       	title: '口令复制成功',
				       	icon: 'none'
				       });
					   this.close()
				    }
				});
			},
			getData(){
				this.$store.dispatch("apiGetPass",{
					id:this.id,
					type:this.type
				}).then(res=>{
					this.koulin=res.data.data.token;
					if(this.type==1){		//拼团
						this.$store.dispatch("apiGetMyGroupDt",{
							userId:0,
							id:this.id,
							page_no:1,
							page_size:10
						}).then(dtRes=>{
							this.title=dtRes.data.data.courseGroup.course.name;
							this.cntText=this.koulin;
							this.img=dtRes.data.data.courseGroup.course.img;
							this.href=res.data.data.link
						})
					}else if(this.type==2){		//课程
						this.$store.dispatch("apiGetGoodDetailById",{
							id:this.id,
							userId:0
						}).then(dtRes=>{
							this.title=dtRes.data.data.name;
							this.cntText=this.koulin;
							this.img=dtRes.data.data.img;
							this.href=res.data.data.link
							
						})
					}else if(this.type==3){		//店铺
						this.$store.dispatch("apiGetShopDetail",{
							id:this.id,
							userId:0
						}).then(dtRes=>{
							this.title=dtRes.data.data.name;
							this.cntText=this.koulin;
							this.img=dtRes.data.data.logo;
							this.href=res.data.data.link
						})
					}else if(this.type==4){		//拼团活动
						this.$store.dispatch("apiGetGroupDetailpt",{
							id:this.id,
							userId:0
						}).then(dtRes=>{
							this.title=dtRes.data.data.course.name;
							this.cntText=this.koulin;
							this.img=dtRes.data.data.course.img;
							this.href=res.data.data.link
						})
					}else if(this.type==5){
						this.$store.dispatch("apiGetZeroDetail",{
							id:this.id,
							userId:0
						}).then(dtRes=>{
							this.title=dtRes.data.data.course.name;
							this.cntText=this.koulin;
							this.img=dtRes.data.data.course.img;
							this.href=res.data.data.link
						})
					}else if(this.type==6){
						this.$store.dispatch("spellGroupDetails",{
							id:this.id,
							userId:0
						}).then(dtRes=>{
							this.title=dtRes.data.data.course.name;
							this.cntText=this.koulin;
							this.img=dtRes.data.data.course.img;
							this.href=res.data.data.link
						})
					}
					
					
				});
				
				
			},
			close(){
				this.isShow=false;
				this.acShow=true;
			},
			open(){
				this.getData()
				this.isShow=true;
			},
			openQQ(){
				this.isShow=false;
				this.acShow=true;
				this.copy()
				if (plus.os.name == 'Android') {
				    plus.runtime.launchApplication(  
				        {  
				            pname: 'com.tencent.mobileqq'  
				        },  
				        function(e) {  
				            console.log('打开QQ失败' + e.message);  
				        }  
				    );  
				} else if (plus.os.name == 'iOS') {  
				    plus.runtime.launchApplication({ action: 'mqq://' }, function(e) {  
				        console.log('打开QQ失败: ' + e.message);  
				    });  
				}  
			}
		},
		created() {
			uni.$on("showShare",payload=>{
				this.type=payload.type;
				this.id=parseInt(payload.id)
			})
			
			this.checkInstall()
			
		}
	}
</script>

<style lang="less" scoped>
	.mask{
		position: fixed;
		width: 100%;
		height: 100%;
		top: 0;
		left: 0;
		z-index: 999999999;
		background-color: rgba(0,0,0,0.5);
		display: flex;
		align-items: flex-end;
		.actionBox{
			width: 100%;
			background-color: #FFFFFF;
			display: flex;
			flex-direction: column;
			.list{
				display: flex;
				padding: 30upx 20upx;
				.item{
					display: flex;
					flex-direction: column;
					align-items: center;
					width: 20%;
					.iconfont{
						width: 100upx;
						height: 100upx;
						background-color: #f4f4f4;
						border-radius: 50%;
						text-align: center;
						line-height: 100upx;
						font-size: 60upx;
						margin-bottom: 20upx;
						color: #FFFFFF;
					}
					text{
						font-size: 28upx;
						color: #777777;
					}
					.icon-copy{
						color: #757575;
					}
					.icon-qq{
						background-color: #4ca3e5;
					}
					.icon-weixin{
						background-color: #56bc3f;
					}
					.icon-pengyouquan{
						background-color: #5bc2a5;
					}
					.icon-sina{
						background-color: #db4637;
					}
				}
			}
			button{
				width: 100%;
				font-size: 32upx;
				height: 110upx;
				line-height: 100upx;
				background-color: #FFFFFF;
				border-top: 10upx solid #f4f4f4;
			}
		}
	
	}
	.acMask{
		align-items: center;
		justify-content: center;
		.koulinBox{
			width: 90%;
			background-color: #FFFFFF;
			border-radius: 20upx;
			padding: 30upx;
			display: flex;
			flex-direction: column;
			align-items: center;
			font-size: 32upx;
			.title{
				font-size: 36upx;
				font-weight: bold;
			}
			.koulin{
				margin-top: 20upx;
				width: 100%;
				background-color: #f4f4f4;
				padding: 20upx 10upx;
				border-radius: 10upx;
				color: #777777;
				word-break: break-all;
			}
			.buttonBox{
				margin-top: 20upx;
				display: flex;
				align-items: center;
				color: #FFFFFF;
				background-color: #4ca3e5;
				height: 90upx;
				border-radius: 45upx;
				line-height: 90upx;
				padding: 0 30upx;
				.iconfont{
					font-size: 48upx;
					margin-right: 10upx;
				}
			}
		}
	}
</style>
